<template>
	<view class="count">
		<view class="tabbar">
			<u-tabs :list="list" :is-scroll="false" active-color="#009D85" inactive-color="#999999" :current="current"
				@change="change"></u-tabs>
		</view>
		<!-- 下面的公告内容 -->
		<view class="counts p-l-25 p-r-25">
			<scroll-view style="height: 100%;" scroll-y="true" @scrolltolower="lowerBot" scroll-with-animation>
				<view v-for="(item,index) in annList" :key="index" class="item m-t-20 p-20 b-f b-r-20">
					<view class="top">
						{{item.content}}
					</view>
					<view class="time m-t-10">
						发布时间：{{item.created_at}}
					</view>
				</view>
			</scroll-view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				annList: [],
				list: [{
					name: '平台公告'
				}, {
					name: '门店公告'
				}],
				current: 0,
				page: 1
			}
		},
		watch: {
			current(newVal, oldVal) {
				if (newVal == 0) {
					this.page = 1
					this.annList = []
					this.Platform()
				} else if (newVal == 1) {
					this.page = 1
					this.annList = []
					this.Store()
				}
			}
		},
		onShow() {
			this.Platform()
		},
		methods: {
			// 平台公告
			async Platform() {
				let n = await this.$api.Platform(this.page)
				if (this.page == 1) {
					this.annList = n.data.data

				} else {
					this.annList = [...this.annList, ...n.data.data]
				}
			},
			// Store 
			async Store() {
				let n = await this.$api.Store(this.page)
				if (this.page == 1) {
					this.annList = n.data.data
				} else {
					this.annList = [...this.annList, ...n.data.data]
				}
			},
			// 滑到下面
			lowerBot() {
				// 平台公告
				if (this.current == 0) {
					this.page++
					this.Platform()
				} else {
					this.page++
					this.Store()
					// 门店公告
				}
				// console.log('123456');
			},
			change(e) {
				console.log(e, '123');

				this.current = e


			}
		}
	}
</script>

<style lang="scss" scoped>
	.top {
		font-size: 28rpx;
		font-family: PingFang SC, PingFang SC-Bold;
		font-weight: 700;
		color: #333333;
	}

	.time {
		font-size: 26rpx;
		font-family: PingFang SC, PingFang SC-Medium;
		font-weight: 500;
		color: #999999;
	}

	.tabbar {
		height: 40px;
		position: fixed;
		width: 100%;
		top: 0;
		left: 0;
	}

	.counts {
		height: calc(100vh - 40px);
		padding-bottom: 20px;
	}

	.count {
		height: 100vh;
		overflow-y: auto;
		width: 100%;
		padding-top: 40px;
		// padding-bottom: 100px;
	}
</style>